 <!DOCTYPE html>
<html>
<head>

<title>MINIMA COLORED 3 MAG STYLE - RESPONSIVE BLOGGER TEMPLATE - DOCUMENTATION
</title>

<style type="text/css">

/* GitHub Theme */
/* Pretty printing styles. Used with prettify.js. */
/* SPAN elements with the classes below are added by prettyprint. */
/* plain text */
.pln {
  color: #333333;
}
.prettyprint{overflow:auto!important;}

@media screen {
  /* string content */
  .str {
    color: #dd1144;
  }

  /* a keyword */
  .kwd {
    color: #333333;
  }

  /* a comment */
  .com {
    color: #999988;
  }

  /* a type name */
  .typ {
    color: #445588;
  }

  /* a literal value */
  .lit {
    color: #445588;
  }

  /* punctuation */
  .pun {
    color: #333333;
  }

  /* lisp open bracket */
  .opn {
    color: #333333;
  }

  /* lisp close bracket */
  .clo {
    color: #333333;
  }

  /* a markup tag name */
  .tag {
    color: navy;
  }

  /* a markup attribute name */
  .atn {
    color: teal;
  }

  /* a markup attribute value */
  .atv {
    color: #dd1144;
  }

  /* a declaration */
  .dec {
    color: #333333;
  }

  /* a variable name */
  .var {
    color: teal;
  }

  /* a function name */
  .fun {
    color: #990000;
  }
}
/* Use higher contrast and text-weight for printable form. */
@media print, projection {
  .str {
    color: #006600;
  }

  .kwd {
    color: #006;
    font-weight: bold;
  }

  .com {
    color: #600;
    font-style: italic;
  }

  .typ {
    color: #404;
    font-weight: bold;
  }

  .lit {
    color: #004444;
  }

  .pun, .opn, .clo {
    color: #444400;
  }

  .tag {
    color: #006;
    font-weight: bold;
  }

  .atn {
    color: #440044;
  }

  .atv {
    color: #006600;
  }
}
/* Style */
pre.prettyprint {
  background: #F0F0F0;
  font-family: Menlo, "Bitstream Vera Sans Mono", "DejaVu Sans Mono", Monaco, Consolas, monospace;
  font-size: 12px;
  line-height: 1.5;
  border: 1px solid #cccccc;
  padding: 0;
}

/* Specify class=linenums on a pre to get line numbering */
ol.linenums {
  margin-top: 0;
  margin-bottom: 0;
  color: #888;
}

.linenums li {
  background: #FAFAFA;
  padding-left: 10px;
  border-left: 1px solid #CCC;
}

.linenums li {
  padding-top: 5px;
}

.linenums li + li {
  padding-top: 0;
}

.linenums li:last-child {
  padding-bottom: 5px;
}



/* IE indents via margin-left */
li.L0,
li.L1,
li.L2,
li.L3,
li.L4,
li.L5,
li.L6,
li.L7,
li.L8,
li.L9 {
  /* */
}

/* Alternate shading for lines */
li.L1,
li.L3,
li.L5,
li.L7,
li.L9 {
  /* */
}










body, html {
    margin: 0;
    padding: 0;
}

body, 
input,
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: fontawesome, Raleway, Helvetica, Arial, "Lucida Grande", sans-serif; 
    font-weight: 300;
    font-size: 18px;
}

body {
    line-height: 2;
    color: #1a1a1a;
    background: #fff;
}

img, iframe {
    max-width: 100%;
}

iframe {
    max-height: 100%;
}

img {
    height:auto;
}

iframe {
    border: 0 !important;
}


header {
    width: 100%;
    overflow: hidden;
}
span.new {
	font-style: italic;
	color: #47abe5;
	font-weight: 500;
}
.container {
    max-width: 97%;
    margin: 0;
    position: relative;
}

strong, dt, h3, h4 {
    font-weight: 700;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 10px 0;
    line-height: 20px;
    color: inherit;
    text-rendering: optimizelegibility;
}


h1,
h2,
h3 {
    line-height: 40px;
}

h2 {
    font-size: 50px;
    line-height: 1.2;
}

h3 {
    font-size: 24.5px;
}

h4 {
    font-size: 17.5px;
}

h5 {
    font-size: 14px;
}

h6 {
    font-size: 11.9px;
}

hr {
    background: #EEE;
    border: 0;
    height: 1px;
    margin: 40px 0 40px;
}

blockquote {
    margin: 1em 0;
    border-left: 3px solid #ccc;
    padding-left: 20px;
    text-align: left;
}



dt {
}

dd {
    padding: 0;
    margin: 0 0 25px 0;
}

a {
    -webkit-transition: all ease 150ms;
    -moz-transition: all ease 150ms;
    -o-transition: all ease 150ms;
    transition: all ease 150ms;
    text-decoration: none;
    color: #4db2ec;
}

a:hover {
    text-decoration: underline;
}

a:active {
    color: #47b5e2;
}

/* Header Styles */
header {
    padding: 2em 0 2em 0; 
    text-align: center; 
    background: #4db2ec; 
    color: #fff;
}


h1 {
    margin: 0;
    padding: 0;
    float: left;
	color:#fff;
	font-weight:bold;
	font-size:35px;
	text-transform:uppercase;
	padding-top: 10px;
	margin-right:30px;
}

header h2 {
    margin: 0 0 1em 0;
}

header h2.docs-header {
    margin: 0;
}

footer {
    text-align: center;
    padding: 1.5em 0;
}

footer p {
    margin: 0;
    color: #999;
}

section img {
height: auto;
border: 1px solid #eee;
}
.small_title {
font: 400 18px fontawesome,Raleway,Tahoma;
color: #4db2ec;
}
.fa-check-square-o:before {
content: "\f046";
}
.fa{margin-right:5px;font-size: 16px;}
.red-color{color:#fa6565;}
.green-color{color:#adde6e;}
.blue-color{color:#3ac6ef;}
.orange-color{color:#ffc452;}
.grey-color{color:#aaa;}
.pink-color{color:#fa5ebd;}
.bluegreen-color{color:#27cea5;}
.purple-color{color:#973dd7;}

.videos{margin:0;padding:0;list-style:none;}
.videos li {
	width: 226px;
	height: 274px;
	float: left;
	margin-right: 20px;
}
.videos li img:hover{opacity:0.8;}

/* Navigation Styles */
nav {
    background: #1a1a1a ;
    padding: 10px 0;
    min-height: 60px;
}
.container h1{margin-top:4px;}

nav ul, nav li {
    margin: 0;
    padding: 0;
    list-style: none;
}

nav a {
    padding: 0 1em;
    color: #EEE;
    font-size: .9em;
    height: 60px;
    line-height: 60px;
    display: block;
	background:#1a1a1a;
}

nav h1 a {
    padding: 7px 1em;
    height: 46px;
    line-height: 0;
	height: 45px;
	line-height: 45px;
}

nav a:hover {
    background: #4db2ec;
    text-decoration: none;
}

nav a:active {
    background: #27637e;
}


nav a:active {
    color: #fff;
    cursor: default;
}



nav ul.toplinks {
    padding: 20px 0 0 0;
}

nav #menu {
    overflow: hidden;
    max-height: 0;
    clear: left;
}


nav #menu-toggle {
    position: absolute;
    right: 0;
    top: 0;
    font-size: 1.5em;
    padding: 0 16px;
}

.totop {
	background: rgba(43,45,49,0.2);
	padding: 5px 10px;
	position: fixed;
	bottom: 10px;
	right: 10px;
	color: #fff;
	border-radius: 2px;
	font-size: 10px;
	text-transform: uppercase;
	font-weight: bold;
	-webkit-transition: all linear 0.2s;
    -moz-transition: all linear 0.2s;
    -o-transition: all linear 0.2s;
    transition: all linear 0.2s;
}
.totop:visited {
	color: #fff;
}
.totop:hover {
	text-decoration: none;
	background: rgba(43,45,49,0.9);
	color: #fff;
	-webkit-transition: all linear 0.2s;
    -moz-transition: all linear 0.2s;
    -o-transition: all linear 0.2s;
    transition: all linear 0.2s;
}


@media only screen and (min-width: 680px) {
    nav, nav #menu {
        height: 60px !important;
    }

    nav li, nav a {
        float: left;
    }


    nav ul.toplinks {
        float: left;
        padding: 0;
        clear: none;
    }

    nav ul.toplinks li {
        margin: 0 0 0 10px;
    }

    nav #menu-toggle {
        display: none !important;
    }

    nav #menu {
        max-height: 9999px;
        clear: none;
    }
}










/* Content Styles */
section { padding: 1em 0 3em; text-align: center; }
section.vibrant { background: #222; color: #fff; }

nav:before, 
nav:after, 
header:before, 
header:after, 
section:before, 
section:after {
    content: " ";
    display: table;
}

nav:after, header:after, section:after  { clear: both; }
nav, header, section { *zoom: 1; }



/* Form Styles */
input {
    display: block;
    vertical-align: middle;
    line-height: 30px;
    margin: 0 auto;
    width: 100%;
    max-width: 400px;

       -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;

    -webkit-transition: all linear 0.2s;
    -moz-transition: all linear 0.2s;
    -o-transition: all linear 0.2s;
    transition: all linear 0.2s;
}

input:focus {
    border-color: #007eb2;
    outline: 0;
}

.docs-nav {
    background-color: #222;
    list-style: none;
    margin: 0 0 0 20px;
    padding: 15px 20px;
    font-size: 0.97em;
}
.docs-nav strong{color:#fff;}
.docs-nav a {
    display: block;
    margin: 0 -20px;
    padding: 0 20px;
    text-decoration: none;
    border-right: 2px solid transparent;
}

@media only screen and (min-width: 400px) {

}

@media only screen and (min-width: 600px) {

}

@media only screen and (min-width: 960px) {
        .docs-nav {
        position: absolute;
        top: 0;
        width: 220px;

        -webkit-transition: top linear 50ms;
        -moz-transition: top linear 50ms;
        -o-transition: top linear 50ms;
        transition: top linear 50ms;
    }

    .docs-nav.fixed {
        position: fixed;
        top: 49px;
        width: 220px;
    }

    .docs-nav a:hover {
        background: #333;
    }

    .docs-nav a:active, 
    .docs-nav .active {
        background: #333;
        border-right: 3px solid #4db2ec;
    }

    .docs-nav .separator {
        height: 20px;
    }

    .docs-content {
        padding-left: 310px;
    }



    header {
        padding: 4em 0 4em 0; 
    }

    .container {
        max-width: 1300px;
        padding: 0 20px;
    }

    section { padding: 3em 0; text-align: left; }
    section.centered {
        text-align: center;
    }

    input {
        display: inline-block;
    }



}










</style>






















</head>
<body >
<nav>
  <div class="container">
    <div id="menu">
      <ul class="toplinks">
        <li><a href="http://arlinadesign.blogspot.com">Blog</a></li>
        <li><a href="http://arlinadesign.blogspot.com/p/contact.html">Contact Us</a></li>
        <li><a href="https://www.facebook.com/arlinadesign">Facebook</a></li>
      </ul>
    </div>
    <a id="menu-toggle" href="#" class=" ">&#9776;</a> </div>
</nav>
<header>
  <div class="container">
    <h2 class="docs-header"> MINIMA COLORED 3 MAG STYLE</h2>
  </div>
</header>
<section>
  <div class="container">
    <ul class="docs-nav" id="menu-left">
      <li><strong>Getting Started</strong></li>
      <li><a href="#Theme_Info" class=" ">Theme Info</a></li>
	  <li><a href="#Features" class=" ">Features</a></li>
      <li><a href="#Installation" class=" ">Installation</a></li>
      <li class="separator"></li>
      <li><strong>Customize Theme</strong></li>
      <li><a href="#Navigation" class=" ">Navigation</a></li>
	  <li><a href="#Meta_Tag" class=" ">Meta Tag</a></li>
      <li><a href="#Mag_Style" class=" ">Mag Style</a></li>
      <li><a href="#Post_page" class=" ">Post Page</a></li>
      <li><a href="#Widgets" class=" ">Widgets</a></li>
      <li><a href="#ShortCodes" class=" ">ShortCodes</a></li>
      <li><a href="#Fixedd" class=" ">Fixed</a></li>     
      <li class="separator"></li>

    </ul>
    <div class="docs-content">
      <h2> Getting Started</h2>
      <h3 id="Theme_Info"> Theme Info</h3>
      <p>
	Created: 16/07/2014<br/>
	Latest Update: 19/12/2014<br/>
	  </p>
      <p>Minima Colored 3 is a simple free Blogger template with Responsive layout and suited for all blog. It's design with simple color combination, clean and modern look, SEO Optimized, and has been built by using some of the most popular current design trends.</p>
      <h3 id="Features"> Features</h3>
      <ul>
<li>Responsive Design</li>
<li>SEO</li>
<li>Adsense Ready</li>
<li>Magazine Style</li>
<li>Custom Threaded Comment</li>
<li>2 Column</li>
<li>White Base Theme Color</li>
<li>Responsive Ad</li>
<li>Breadcrumbs</li>
<li>Related Posts with Thumb</li>
<li>Search Box</li>
<li>Share Button</li>
<li>Top Menu</li>
<li>Main Dropdown Menu</li>
<li>Numbered Page Navigation</li>
<li>Top / Sidebar Social Bookmark</li>
<li>Custom 404 Page</li>
<li>Smooth back To Top Button</li>
<li>Better Print Page Layout</li>
<li>Flickr Widget</li>
<li>Author Box</li>
<li>Custom Contact Form Design</li>
<li>Subscribe Box</li>
<li>And more..</li>
</ul>
<h3 id="Installation"> Installation</h3>
<li>1. Log in to your Blogger dashboard and go to Layout > Edit HTML.</li>

<li>2. Please back up your old template in case you decide to use it again.
To do this, click on the "download full template" link and save the file.</li>

<li>3. Then, browse the location of XML template that you've just downloaded and press "upload".</li>

      <hr>
      <h2> Customize Theme</h2>
	  <h3 id="Navigation"> Navigation</h3>
      
	<p>First Go to Blogger > Template > "Edit HTML"</p>
	  <p>Find below code and change all <span class="small_title">#</span> text with yours.
      </p>
            
	<span class="small_title"><i class="fa fa-check-square-o"></i>Top Navigation :</span>
	  <pre class="prettyprint">&lt;nav class='main-nav'&gt;
.....
.....
.....
&lt;/nav&gt;
</pre>
	
	<span class="small_title"><i class="fa fa-check-square-o"></i>Main Navigation :</span>
	  <pre class="prettyprint">&lt;nav id='menu-wrap'&gt;
.....
.....
.....
&lt;/nav&gt;</pre>

	<span class="small_title"><i class="fa fa-check-square-o"></i>Page Navigation :</span>
    	<p>Find and change the value of <span class="small_title">perPage: 6</span> and <span class="small_title">numPages: 5</span></p>
      <pre class="prettyprint">&lt;b:includable id='page-navi'&gt;
    &lt;div class='pagenav'&gt;
        &lt;script type='text/javascript'&gt;
        var pageNaviConf = {
            perPage: 6,
            numPages: 5,
            firstText: &amp;quot;First&amp;quot;,
            lastText: &amp;quot;Last&amp;quot;,
            nextText: &amp;quot;Next&amp;quot;,
            prevText: &amp;quot;Prev&amp;quot;
        }
        &lt;/script&gt;</pre>
        
	  <h3 id="Meta_Tag"> Meta Tag</h3>
	<p>First Go to Blogger > Template > "Edit HTML"</p>
	  <p>Find and change all <span class="small_title">Uppercase</span> text with yours.
      </p>
	  <pre class="prettyprint">&lt;meta content='YOUR, KEYWORD, PUT, HERE' name='keywords'/&gt;
&lt;link href='https://plus.google.com/YOURGPLUS/posts' rel='publisher'/&gt;
&lt;link href='https://plus.google.com/YOURGPLUS/about' rel='author'/&gt;
&lt;link href='https://plus.google.com/YOURGPLUS' rel='me'/&gt;
&lt;meta content='YOUR VERIFICATION GOOGLE CODE' name='google-site-verification'/&gt;
&lt;meta content='YOUR VERIFICATION BING CODE' name='msvalidate.01'/&gt;
&lt;meta content='YOUR VERIFICATION ALEXA CODE' name='alexaVerifyID'/&gt;
&lt;meta content='INDONESIA' name='geo.placename'/&gt;
&lt;meta content='YOUR NAME' name='Author'/&gt;
&lt;meta content='general' name='rating'/&gt;
&lt;meta content='ID' name='geo.country'/&gt;
&lt;meta content='en_US' property='og:locale'/&gt;
&lt;meta content='en_GB' property='og:locale:alternate'/&gt;
&lt;meta content='id_ID' property='og:locale:alternate'/&gt;
&lt;meta content='YOURFBAPPSID' property='fb:app_id'/&gt;
&lt;meta content='YOURFBUSERID' property='fb:admins'/&gt;
&lt;meta content='@USERNAME' name='twitter:site'/&gt;
&lt;meta content='@USERNAME' name='twitter:creator'/&gt;</pre>
<br/>
	  <h3 id="Mag_Style"> Mag Style</h3>
	  <p> Note : in Mag Top / Bottom Section don't try add any widget oyher than HTML one, follow this</p>
	  <p>Mag Section Type : <b>pmag2, pgallery , pvid</b></p>
	  <p>To add Mag Section Type just simply follow this method by change <span class='blue-color'>Box Type</span> and your <span class='green-color'>Label</span></p>
      <pre class="prettyprint">[Your Label Here][Box Type]</pre>
	  <b>Example :</b>
      <pre class="prettyprint">[Gallery][pgallery]</pre>
	  <p>To add Recent Posts and Recent Comments.</p>
      <span class="small_title"><i class="fa fa-check-square-o"></i>Recent Posts</span>
      <pre class="prettyprint">recentposts</pre>
      <span class="small_title"><i class="fa fa-check-square-o"></i>Recent Comments</span>
      <pre class="prettyprint">recentcomments</pre>
      <br/>
	  <h3 id="Post_page"> Post Page</h3>
      <span class="small_title"><i class="fa fa-check-square-o"></i>Adsense</span>
      <p>First Go to Blogger > Template > "Edit HTML"</p>
      <p>Find below code and change <span class="small_title">&lt;!-- Place Your Ads Here (Already Parsed) --&gt;</span> with your Ads code which already parsed.</p>      
      <pre class="prettyprint">&lt;div expr:id='&amp;quot;adsmiddle1&amp;quot; + data:post.id'/&gt;
&lt;div style='clear:both; margin:10px 0'&gt;
&lt;!-- Place Your Ads Here (Already Parsed) --&gt;
&lt;/div&gt;
&lt;div expr:id='&amp;quot;adsmiddle2&amp;quot; + data:post.id'&gt;
&lt;data:post.body/&gt;
&lt;/div&gt;
&lt;script type='text/javascript'&gt;
var obj0=document.getElementById(&amp;quot;adsmiddle1&lt;data:post.id/&gt;&amp;quot;);
var obj1=document.getElementById(&amp;quot;adsmiddle2&lt;data:post.id/&gt;&amp;quot;);
var s=obj1.innerHTML;
var r=s.search(/\x3C!-- adsense --\x3E/igm);
if(r&amp;gt;0) {obj0.innerHTML=s.substr(0,r);obj1.innerHTML=s.substr(r+16);}
&lt;/script&gt;</pre>
      <p>Next step, when you write the post. Put below code in post editor.</p>
      <pre class="prettyprint">&lt;!-- adsense --&gt;</pre>
      <p>Example : </p>
      <pre class="prettyprint">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce fringilla venenatis odio, a consequat massa blandit ac.
Mauris ornare sapien in neque venenatis, ac fermentum tortor scelerisque. Integer sed ultricies magna, vitae gravida eros.
&lt;!-- adsense --&gt;
Etiam sapien massa, facilisis et semper in, sollicitudin ut turpis.Donec ac mauris dignissim, pretium enim non, vulputate est. Aliquam ut elementum enim, a vestibulum ipsum. Sed fringilla ac erat ut vulputate. Curabitur scelerisque, ligula non pretium venenatis, diam tortor sagittis mi, at malesuada risus leo nec est. Phasellus eleifend, purus a porttitor egestas, orci est porttitor ligula, et consequat diam tellus sed dolor. Aenean eu semper mauris, ut egestas nibh.</pre>  

<span class="small_title"><i class="fa fa-check-square-o"></i>Adsense Ready [Ads Inside Post]</span>
<p>In this Template you will be able to add ads inside articles easily top or the middle or the bottom of the article as you like only follow the steps below :</p>
	<p>Go to your <a href='https://blogger.com/home'>dashboard</a>, and click on layout</p>
	<p>Click edit in Ads Inside Post widget and add your ad code inside the box content</p>
	<p>Now just inside your post between text add <span class='red-color'>[post_ad]</span></p>.

      <span class="small_title"><i class="fa fa-check-square-o"></i>Author Box</span>
      <p>First Go to Blogger > Template > "Edit HTML"</p>
      <p>Find below code.</p>   
      <pre class="prettyprint">&lt;div class='articleAuthor'&gt;
.....
.....
.....
&lt;/div&gt;</pre>
      <br/>
      <h3 id="Widgets"> Widgets</h3>
      <span class="small_title"><i class="fa fa-check-square-o"></i>Contact Form</span>
      <p>Add New Page for Static Page > Copy and paste all below code in it (HTML Mode). FYI : After adding this code, make sure you do not move to Compose mode.</p>
      <pre class="prettyprint">&lt;form name=&quot;contact-form&quot;&gt;
&lt;span style=&quot;font-family: Helvetica Neue, Arial, Helvetica, sans-serif;&quot;&gt;&lt;i class=&quot;fa fa-user&quot;&gt;&lt;/i&gt; Name &lt;/span&gt;
&lt;input id=&quot;ContactForm1_contact-form-name&quot; name=&quot;name&quot; size=&quot;30&quot; type=&quot;text&quot; value=&quot;&quot; /&gt;  
&lt;span style=&quot;font-family: Helvetica Neue, Arial, Helvetica, sans-serif;&quot;&gt;&lt;i class=&quot;fa fa-envelope&quot;&gt;&lt;/i&gt; Email Adress &lt;span style=&quot;color: red; font-weight: bolder;&quot;&gt;*&lt;/span&gt;&lt;/span&gt; 
&lt;input id=&quot;ContactForm1_contact-form-email&quot; name=&quot;email&quot; size=&quot;30&quot; type=&quot;text&quot; value=&quot;&quot; /&gt;  
&lt;span style=&quot;font-family: Helvetica Neue, Arial, Helvetica, sans-serif;&quot;&gt;&lt;i class=&quot;fa fa-pencil&quot;&gt;&lt;/i&gt; Content &lt;span style=&quot;color: red; font-weight: bolder;&quot;&gt;*&lt;/span&gt;&lt;/span&gt;
&lt;textarea cols=&quot;25&quot; id=&quot;ContactForm1_contact-form-email-message&quot; name=&quot;email-message&quot; rows=&quot;5&quot;&gt;&lt;/textarea&gt; 
&lt;input id=&quot;ContactForm1_contact-form-submit&quot; type=&quot;button&quot; value=&quot;Send&quot; /&gt;  
&lt;div style=&quot;max-width: 222px; text-align: center; width: 100%;&quot;&gt;
&lt;div id=&quot;ContactForm1_contact-form-error-message&quot;&gt;
&lt;/div&gt;
&lt;div id=&quot;ContactForm1_contact-form-success-message&quot;&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/form&gt;</pre>
      <span class="small_title"><i class="fa fa-check-square-o"></i>Sitemap 1</span>
      <p>Add New Page for Static Page > Copy and paste all below code in it (HTML Mode).</p>
      <pre class="prettyprint">&lt;div id=&quot;tabbed-toc&quot;&gt;
&lt;span class=&quot;loading&quot;&gt;Loading...&lt;/span&gt;&lt;/div&gt;
&lt;script type=&quot;text/javascript&quot;&gt;
var tabbedTOC = {
    blogUrl: &quot;http://afusions.blogspot.com/&quot;, // Blog URL
    containerId: &quot;tabbed-toc&quot;, // Container ID
    activeTab: 1, // The default active tab index (default: the first tab)
    showDates: false, // `true` to show the post date
    showSummaries: false, // `true` to show the posts summaries
    numChars: 200, // Number of summary chars
    showThumbnails: false, // `true` to show the posts thumbnails (Not recommended)
    thumbSize: 40, // Thumbnail size
    noThumb: &quot;http://3.bp.blogspot.com/-vpCFysMEZys/UOEhSGjkfnI/AAAAAAAAFwY/h1wuA5kfEhg/s72-c/grey.png&quot;, // A &quot;no thumbnail&quot; URL
    monthNames: [ // Array of month names
        &quot;January&quot;,
        &quot;February&quot;,
        &quot;March&quot;,
        &quot;April&quot;,
        &quot;May&quot;,
        &quot;June&quot;,
        &quot;July&quot;,
        &quot;August&quot;,
        &quot;September&quot;,
        &quot;October&quot;,
        &quot;November&quot;,
        &quot;December&quot;
    ],
    newTabLink: true, // Open link in new window?
    maxResults: 99999, // Maximum post results
    preload: 0, // Load the feed after 0 seconds (option =&gt; time in milliseconds || &quot;onload&quot;)
    sortAlphabetically: true, // `false` to sort posts by published date
    showNew: 7, // `false` to hide the &quot;New!&quot; mark in most recent posts, or define how many recent posts are to be marked
    newText: &quot; - &lt;em style='color:red;'&gt;New!&lt;/em&gt;&quot; // HTML for the &quot;New!&quot; text
};
&lt;/script&gt;
&lt;script src=&quot;https://arlina-design.googlecode.com/svn/trunk/javascript/tabbed-toc.js&quot; type=&quot;text/javascript&quot;&gt;&lt;/script&gt;</pre>     
      <span class="small_title"><i class="fa fa-check-square-o"></i>Sitemap 2</span>
      <p>Add New Page for Static Page > Copy and paste all below code in it (HTML Mode).</p>
      <pre class="prettyprint">&lt;div id=&quot;table-outer&quot;&gt;
&lt;table&gt;&lt;tbody&gt;
&lt;tr&gt;&lt;td&gt;&lt;label&gt;Sort posts by : &lt;/label&gt;&lt;/td&gt;&lt;td&gt;&lt;select id=&quot;orderFeedBy&quot;&gt;&lt;option selected=&quot;&quot; value=&quot;published&quot;&gt;New post&lt;/option&gt;&lt;option value=&quot;updated&quot;&gt;Post updated&lt;/option&gt;&lt;/select&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td&gt;&lt;label&gt;Filter posts by category : &lt;/label&gt;&lt;/td&gt;&lt;td&gt;&lt;span id=&quot;labelSorter&quot;&gt;&lt;select disabled=&quot;&quot;&gt;&lt;option selected=&quot;&quot;&gt;Loading...&lt;/option&gt;&lt;/select&gt;&lt;/span&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td&gt;&lt;label&gt;Search by keyword : &lt;/label&gt;&lt;/td&gt;&lt;td&gt;&lt;form id=&quot;postSearcher&quot;&gt;
&lt;input type=&quot;text&quot; /&gt;&lt;/form&gt;
&lt;/td&gt;&lt;/tr&gt;
&lt;/tbody&gt;&lt;/table&gt;
&lt;/div&gt;
&lt;header id=&quot;resultDesc&quot;&gt;&lt;/header&gt;
&lt;ul id=&quot;feedContainer&quot;&gt;&lt;/ul&gt;
&lt;div id=&quot;feedNav&quot;&gt;
Loading...&lt;/div&gt;
&lt;script src=&quot;https://arlina-design.googlecode.com/svn/tocs.js&quot; type=&quot;text/javascript&quot;&gt;&lt;/script&gt;
&lt;style scoped=&quot;&quot; type=&quot;text/css&quot;&gt;
#comments {display:none;}
&lt;/style&gt;</pre>
      <span class="small_title"><i class="fa fa-check-square-o"></i>Ad Banner HTML</span>
      <p>Add New widget > Copy and paste all below code in it.</p>
      
       <p>Banner 728x90.</p>     
      <pre class="prettyprint">&lt;div class='kotak_iklan3'&gt;
&lt;a href='#' target='_blank' title='ADS-DESCRIPTION'&gt;&lt;img alt='iklan banner' height='90' src='IMAGE-URL' title='ADS-DESCRIPTION' width='728'/&gt;&lt;/a&gt;
&lt;/div&gt;</pre>

       <p>Banner 125x125.</p>     
      <pre class="prettyprint">&lt;div class=&quot;kotak_iklan&quot;&gt;
&lt;a href=&quot;#&quot; title=&quot;judul iklan&quot;&gt;&lt;img style=&quot;border: none;&quot; src=&quot;IMAGE-URL&quot; alt=&quot;text gambar&quot; width=&quot;125&quot; height=&quot;125&quot; /&gt;&lt;/a&gt;
&lt;a href=&quot;#&quot; title=&quot;judul iklan&quot;&gt;&lt;img style=&quot;border: none;&quot; src=&quot;IMAGE-URL&quot; alt=&quot;text gambar&quot; width=&quot;125&quot; height=&quot;125&quot; /&gt;&lt;/a&gt;
&lt;a href=&quot;#&quot; title=&quot;judul iklan&quot;&gt;&lt;img style=&quot;border: none;&quot; src=&quot;IMAGE-URL&quot; alt=&quot;text gambar&quot; width=&quot;125&quot; height=&quot;125&quot; /&gt;&lt;/a&gt; 
&lt;a href=&quot;#&quot; title=&quot;judul iklan&quot;&gt;&lt;img style=&quot;border: none;&quot; src=&quot;IMAGE-URL&quot; alt=&quot;text gambar&quot; width=&quot;125&quot; height=&quot;125&quot; /&gt;&lt;/a&gt; 
&lt;/div&gt;</pre>

      <span class="small_title"><i class="fa fa-check-square-o"></i>Subscribe Box</span>
      <p>Add New widget > Copy and paste all below code in it.</p>
      
       <p>Change <span class='red-color'>AFusion</span> to your Subscribe blog.</p>     
      <pre class="prettyprint">&lt;div id='subscribe-box'&gt;
                 &lt;p&gt;Sign up here with your email.&lt;/p&gt;
             &lt;div class='emailfield'&gt;
              &lt;form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&amp;apos;http://feedburner.google.com/fb/a/mailverify?uri=AFusion&amp;apos;, &amp;apos;popupwindow&amp;apos;, &amp;apos;scrollbars=yes,width=550,height=520&amp;apos;);return true' target='popupwindow'&gt;
               &lt;input type='text' name='name' onblur='if (this.value == &amp;quot;&amp;quot;) {this.value = &amp;quot;Your Name&amp;quot;;}' onfocus='if (this.value == &amp;quot;Your Name&amp;quot;) {this.value = &amp;quot;&amp;quot;;}' value='Your Name'/&gt;
               &lt;input type='text' name='email' onblur='if (this.value == &amp;quot;&amp;quot;) {this.value = &amp;quot;Your Email&amp;quot;;}' onfocus='if (this.value == &amp;quot;Your Email&amp;quot;) {this.value = &amp;quot;&amp;quot;;}' value='Your Email'/&gt;
&lt;input name='uri' type='hidden' value='AFusion'/&gt;
&lt;input name='loc' type='hidden' value='en_US'/&gt;
                &lt;input class='submitbutton' type='submit' value='Subscribe Now!'/&gt;

              &lt;/form&gt;
             &lt;/div&gt;
&lt;/div&gt;</pre>
      <span class="small_title"><i class="fa fa-check-square-o"></i>Flickr Widget</span>
      <p>Add New widget > Copy and paste all below code in it.</p>
      
       <p>Change <span class='red-color'>44532761@N02</span> to your flickr stream album code.</p>     
      <pre class="prettyprint">&lt;div class=&quot;flickr_plugin&quot;&gt;
&lt;script src=&quot;http://www.flickr.com/badge_code_v2.gne?count=8&amp;amp;display=latest&amp;amp;size=s&amp;amp;layout=x&amp;&amp;amp;source=user&amp;amp;user=44532761@N02&quot; type=&quot;text/javascript&quot;&gt;
&lt;/script&gt;
&lt;/div&gt;</pre>
  <br/>
	  
      <h3 id="ShortCodes"> ShortCodes</h3>
        <span class="small_title"><i class="fa fa-check-square-o"></i>Drop Caps</span>
		<pre class="prettyprint">
&lt;span class=&quot;first-letter&quot;&gt;Your First Letter here&lt;/span&gt;
		</pre>
        
        <span class="small_title"><i class="fa fa-check-square-o"></i>Alert Box</span>
		<pre class="prettyprint">/*----success message----*/
  &lt;div class=&quot;alert-message success&quot;&gt;
  success message : You successfully read this important message. &lt;i class=&quot;fa fa-check-circle&quot;&gt;&lt;/i&gt;
  &lt;/div&gt;
  
  /*----Alert message-----*/
  &lt;div class=&quot;alert-message alert&quot;&gt;
  Alert message : This alert needs your attention. &lt;i class=&quot;fa fa-info-circle&quot;&gt;&lt;/i&gt;
  &lt;/div&gt;
  
  /*----Warning message-----*/
  &lt;div class=&quot;alert-message warning&quot;&gt;
  Warning message : Warning! Best check yo self. &lt;i class=&quot;fa fa-exclamation-triangle&quot;&gt;&lt;/i&gt;
  &lt;/div&gt;
  
  /*----Error message-----*/
  &lt;div class=&quot;alert-message error&quot;&gt;
  Error message : Oh snap! Change a few things up. &lt;i class=&quot;fa fa-exclamation-circle&quot;&gt;&lt;/i&gt;
  &lt;/div&gt;</pre>
  
        <span class="small_title"><i class="fa fa-check-square-o"></i>Blockquote</span>
		<p>To create a Blockquote simply select all text you want to be a Quote and click on Quote icon from blog post text editor panel.</p>
        <span class="small_title"><i class="fa fa-check-square-o"></i>Bullet and List</span>
		<p>To create a Bullet simply select all text you want to be a Bullet and click on Bullet List icon from blog post text editor panel.<br/>
		To create a Ordered List simply select all text you want to be a Ordered List and click on Numbered List icon from blog post text editor panel.</p>
        <span class="small_title"><i class="fa fa-check-square-o"></i>Buttons</span>
		<p>Add the demo and download button.</p>
		<pre class="prettyprint">
  &lt;div style=&quot;text-align: center;&quot;&gt;
&lt;ul class=&quot;button&quot;&gt;
&lt;li&gt;&lt;a class=&quot;demo&quot; href=&quot;YOUR-LINK-HERE&quot; target=&quot;_blank&quot;&gt;DEMO&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a class=&quot;download&quot; href=&quot; YOUR-LINK-HERE&quot; target=&quot;_blank&quot;&gt;DOWNLOAD&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;/div&gt;
&lt;div class=&quot;clear&quot;&gt;&lt;/div&gt;
  </pre>      
        <span class="small_title"><i class="fa fa-check-square-o"></i>Pre Code</span>
        <pre class="prettyprint">
&lt;pre title=&quot;HTML&quot; data-codetype =&quot;HTMLku&quot;&gt;&lt;code class=&quot;language-markup&quot;&gt; ... Your HTML (already escaped) put here ... &lt;/code&gt;&lt;/pre&gt;
&lt;pre title=&quot;CSS&quot; data-codetype =&quot;CSSku&quot;&gt;&lt;code class=&quot;language-css&quot;&gt; ... Your CSS put here ... &lt;/code&gt;&lt;/pre&gt;
&lt;pre title=&quot;Javascript&quot; data-codetype =&quot;JavaScriptku&quot;&gt;&lt;code class=&quot;language-javascript&quot;&gt; ... Your JavaScript put here ... &lt;/code&gt;&lt;/pre&gt;
&lt;pre title=&quot;jQuery&quot; data-codetype =&quot;JQueryku&quot;&gt;&lt;code class=&quot;language-javascript&quot;&gt; ... Your jQuery put here ... &lt;/code&gt;&lt;/pre&gt;
		</pre>
        <span class="small_title"><i class="fa fa-check-square-o"></i>Spoiler</span>
        <pre class="prettyprint">
&lt;div id=&quot;flippy&quot;&gt;&lt;button&gt;Spoiler&lt;/button&gt;&lt;/div&gt;
&lt;div id=&quot;flippanel&quot;&gt;
--- YOUR CONTENT GOES HERE ---
&lt;/div&gt;
		</pre>        
<br/>
      <h3 id="Fixedd"> Fixed</h3>
        <span class="small_title"><i class="fa fa-check-square-o"></i>Mobile Responsive</span>
        <p>To provide responsive look better on a mobile device, please click Template > Gear > Select None. Show mobile template on mobile devices.</p>
        <span class="small_title"><i class="fa fa-check-square-o"></i>Video Thumbnail</span>
        <p>When you copy youtube embed code to html of the post it will be in this form</p>
		<pre class="prettyprint">
&lt;iframe allowfullscreen=&quot;&quot; frameborder=&quot;0&quot; height=&quot;315&quot; src=&quot;//www.youtube.com/embed/HLCasyAh7ic&quot; width=&quot;100%&quot;&gt;&lt;/iframe&gt;
		</pre>
        <p>But in blogger youtube thumbnail will not appear, so to fix it you just need to add <span class='red-color'>https</span> in the youtube embed codes and it will look like this.</p>
        <pre class="prettyprint">
&lt;iframe allowfullscreen=&quot;&quot; frameborder=&quot;0&quot; height=&quot;315&quot; src=&quot;https://www.youtube.com/embed/HLCasyAh7ic&quot; width=&quot;100%&quot;&gt;&lt;/iframe&gt;
		</pre>
        <p>Okay thats it, have fun and enjoy.</p>
<br/>        
    </div>
  </div>
</section>
<section class="vibrant centered">
  <div class="container">
    <h4> arlinadesign.blogspot.com </h4>
  </div>
</section>
<footer>
  <div class="container">
    <p> &copy; 2014 Arlina Design </p>
  </div>
</footer>

<a class="totop" href="#">Top</a>

<script src="https://proyek-google-jou.googlecode.com/svn/ssss/assets/js/jquery.min.js"></script> 
 
<script type="text/javascript" src="https://proyek-google-jou.googlecode.com/svn/ssss/assets/js/prettify/prettify.js"></script> 
<script src="https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js?lang=css&skin=sunburst"></script>
<script src="https://proyek-google-jou.googlecode.com/svn/ssss/assets/js/layout.js"></script>
 <script src="https://proyek-google-jou.googlecode.com/svn/ssss/assets/js/jquery.localscroll-1.2.7.js" type="text/javascript"></script>
 <script src="https://proyek-google-jou.googlecode.com/svn/ssss/assets/js/jquery.scrollTo-1.4.3.1.js" type="text/javascript"></script>
 <script src="https://proyek-google-jou.googlecode.com/svn/ssss/assets/js/top.js" type="text/javascript"></script>
</body>
</html>
